<div class="layui-fluid">
    <div class="layui-card">
        <script template type="text/html">
            <div class="layui-card-body">
                <table id="{{layui.admin.getPageSign()||layui.router().search.TableNo}}-table" lay-filter="{{layui.admin.getPageSign()||layui.router().search.TableNo}}-table"></table>
            </div>
        </script>
    </div>
</div>

<script>
    layui.use('reForm', function () {
        var $ = layui.$
            , reForm = layui.reForm
            , form = layui.form
            , admin = layui.admin

            , tableId = admin.getPageSign() || layui.router().search.TableNo
            , searchFormNo = tableId + '-search-form'
            , subFormNo = tableId + '-form';

        admin.jsonData('/json/form/' + searchFormNo, function (searchForm) {
                var searchFormItemsData =  admin.stringToObj(searchForm);
                var html = '<form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="' + searchFormNo + '" id="' + searchFormNo + '">'
                    + layui.admin.getFormHtml(searchFormItemsData)
                    + '</form>';
                layui.$('#' + tableId + '-table').parent().before(html);

                $.each(searchFormItemsData, function (idx, json) {
                    reForm.bindFormHtml(json, null, searchFormNo);
                });

                form.render(null, searchFormNo);
            })

        admin.jsonData('/json/table/' + tableId, function (tempTable) {
            var options = admin.stringToObj(tempTable);

            if (options.options)
                delete options.options;

            options.buildType = 1;
            options.tableId = tableId;

            if (options.tableOptions) {
                if (options.tableOptions.options)
                    delete options.tableOptions.options;

                if (options.tableOptions.where) {
                    options.tableOptions.where = layui.admin.funObj(options.tableOptions.where);
                    if (options.tableOptions.where.SearchWhere)
                        options.tableOptions.where.SearchWhere = JSON.stringify(options.tableOptions.where.SearchWhere);
                }

                if (options.tableOptions.initSort)
                    options.tableOptions.initSort = layui.admin.funObj(options.tableOptions.initSort);
            }

            if (options.formOptions) {
                if (options.formOptions.options)
                    delete options.formOptions.options;

                if (!options.formOptions.url) {
                    subFormNo = options.formOptions.formLay || subFormNo;
                    admin.jsonData('/json/form/' + subFormNo, function (subForm) {
                        var subFormItemsData = admin.stringToObj(subForm);
                        var html = '<form class="layui-form " lay-filter="' + subFormNo + '" id="' + subFormNo + '">'
                            + layui.admin.getFormHtml(subFormItemsData)
                            + layui.admin.getFormBtn(tableId)
                            + '</form>';
                        options.formOptions.formLay = subFormNo;
                        options.formOptions.formHtml = html;
                        options.formOptions.FormItemsData = subFormItemsData;
                    })
                }
            }

            if (options.tableType === 'table') {
                layui.use('reTable', function () {
                    var reTable = layui.reTable;

                    reTable.initTable(options);
                })
            } else {
                layui.use('reTreeGrid', function () {
                    var reTreeGrid = layui.reTreeGrid;

                    reTreeGrid.initTreeGrid(options);
                })
            }
        })
    })
</script>